<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>JSX</title>
  </head>
  <body>
    <div id="root"></div>

    <script src="./js/react.development.js"></script>
    <script src="./js/react-dom.development.js"></script>
    <!-- 这里 babel 可以将 jsx 的语法, 转为 js 语法 -->
    <script src="./js/babel.min.js"></script>

    <script type="text/babel">
      //通过 JSX 语法来创建 react 元素
      // let h2 = <h2>Hello React</h2>;

      //复杂结构
      let div = <div>
          <h2 title="李佳琦眉笔事件">李佳琦出事儿啦</h2>
          <p>
            李佳琦眉笔 79 这么多年没涨价  
          </p>
        </div>

      //渲染
      ReactDOM.render(div, document.querySelector('#root'));
    </script>

  </body>
</html>
